import { computed, defineComponent, ref } from 'vue';
import Dialog from './Dialog.vue';
import DialogInDialog from './DialogInDialog.vue';
import DialogMenu from './DialogMenu.vue';
import Menu from './Menu.vue';
import MenuTree from './MenuTree.vue';

export default defineComponent({
  name: 'App',
  props: {},
  emits: [],

  setup(props, { attrs, emit, expose, slots }) {
    expose({});

    return () => {
      return (
        <div class='block'>
          <div class='block-'>
            <h5 class='title'>Dialog</h5>
            <Dialog />
          </div>
          <div class='block-'>
            <h5 class='title'>DialogInDialog</h5>
            <DialogInDialog />
          </div>
          <div class='block-'>
            <h5 class='title'>DialogMenu</h5>
            <DialogMenu />
          </div>
          <div class='block-'>
            <h5 class='title'>Menu</h5>
            <Menu />
          </div>
          <div class='block-'>
            <h5 class='title'>MenuTree</h5>
            <MenuTree />
          </div>
        </div>
      );
    };
  },
});
